<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../../sources/jq/jq.js"></script>
</head>
<body>
<table border="1px solid">

    <tr>
        <td colspan="4">瑞峰电脑清单</td>
    </tr>
    <tr>
        <td colspan="4">
        <form>
            <label>电脑编号</label><input id="num">
            <label>电脑ip地址</label><input id="ip">
            <label>使用学员</label><input id="stu">
            <input value="添加" type="button" id="add">
            <input value="删除" type="button" id="del">
        </form>
        </td>
    </tr>
    <tr id="tr1">
        <td><label for="select_all">全选</label><input id="select_all" type="checkbox"></td>
        <td>电脑编号</td>
        <td>电脑ip地址</td>
        <td>使用学员</td>
    </tr>
</table>
<script>
    $('#add').click(
        function () {
            var num = $('#num').val();
            var ip = $('#ip').val();
            var stu = $('#stu').val();
            if(num === undefined ||num === null ||num === ""){
                alert('请输入电脑编号');
                return
            }
            if(ip === undefined ||ip === null ||ip === ""){
                alert('请输入Ip');
                return
            }
            if(stu === undefined ||stu === null ||stu === ""){
                alert('请输入学员编号');
                return
            }
            $('#tr1').after(
            "<tr><td><label>选择</label><input class='select' type='checkbox'></td>" +
                "<td>"+num+"</td>" +
                "<td>"+ip+"</td>" +
                "<td>"+stu+"</td> " +
                "</tr>"
            );
            $('#num').prop("value","");
            $('#ip').prop("value","");
            $('#stu').prop("value","");
        }
    );

    $('#select_all').click(
        function () {
            if($(this).prop('checked') === true){
                $('.select').prop('checked',true)
            }else{
                $('.select').prop('checked',false)
            }

        }
    );
    
    $('#del').click(
        function () {
            $(':input.select:checked').parent().parent().remove()
        }
    )
</script>
</body>
</html>